
<!doctype html>
<html lang="en" class="fixed">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>联通用户资费管理系统</title>
    <link rel="apple-touch-icon" sizes="120x120" href="favicon/apple-icon-120x120.png">
    <link rel="icon" type="image/png" sizes="192x192" href="favicon/android-icon-192x192.png">
    <link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
    <link rel="stylesheet" type="text/css" href="http://apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="http://cdn.bootcss.com/font-awesome/4.6.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="vendor/animate.css/animate.css">
    <link rel="stylesheet" href="vendor/data-table/media/css/dataTables.bootstrap.min.css">
    <link rel="stylesheet" href="vendor/data-table/extensions/Responsive/css/responsive.bootstrap.min.css">
    <link rel="stylesheet" href="stylesheets/css/style.css">
	<link href="JBox/plugins/Notice/jBox.Notice.css"  rel="stylesheet"/>
    <link href="JBox/plugins/Confirm/jBox.Confirm.css" rel="stylesheet" />
    
	<script type="text/javascript" src="javascripts/jquery.min.js"></script>
	<script src="vendor/data-table/media/js/jquery.dataTables.min.js"></script>
	<script src="vendor/data-table/media/js/dataTables.bootstrap.min.js"></script>
	<script src="vendor/data-table/extensions/Responsive/js/dataTables.responsive.min.js"></script>
	<script src="vendor/data-table/extensions/Responsive/js/responsive.bootstrap.min.js"></script>
	<script src="javascripts/examples/tables/data-tables.js"></script>
	<script type="text/javascript" src="javascripts/jquery.cookie.js" ></script>
	<script type="text/javascript" src="JBox/jBox.js"></script>
	<script type="text/javascript" src="JBox/plugins/Notice/jBox.Notice.js"></script>
	<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
	<script src="vendor/nano-scroller/nano-scroller.js"></script>
	<script>
		if($.cookie("UM")==null||$.cookie("UM")=="null"){
    		window.location="login.html";
    	}
		
		$(document).ready(function(){
    		$(".user-name").text($.cookie("UMN"));
    		$(".user-profile").text($.cookie("UMC"));
    		$(".user-photo img").attr("title",$.cookie("UMN"));
    		
    		initUserPhone();
    		
    		$(".log-out").click(function(){
    			$.cookie("UM",null);
    			$.cookie("UMN",null);
    			$.cookie("UMC",null);
    			window.location="login.html";
    		});
    	});
    	
    	function initUserPhone(){
    		$.ajax({
	          	type: "post",
                dataType: "json",
                contentType: "application/json",                
	          	url: "UnicomService.asmx/GetAllUserPhone",
                cache: false,
                beforeSend: function () { },
                success: function (result) {
					var html="";
					for(var i=0;i<result.d.length;i++){
						html+="<tr><td style='vertical-align:middle'>"+result.d[i].phoneinfo_PNO+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].userinfo_UNAME+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].userinfo_UIDNO+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].setmenus_SNAME+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].setflows_FNAME+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].phoneinfo_PSTATUS+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].phoneinfo_PINITIME+"</td>";
                        html+="<td style='vertical-align:middle'><a class='btn btn-danger' data-toggle='modal' onclick='showDelUser("+result.d[i].phoneinfo_ID+")' href='#myModal'>销户</a></td></tr>";
					}	
					$("#table-userphone tbody").html(html);					
           		},
           		error: function (msg) { console.log(msg.responseText); }
         	});
    	}
    	
    	function searchUser(sear){
    		if($.trim(sear)!=""){
    			$.ajax({
	          	type: "post",
                dataType: "json",
                contentType: "application/json",                
	          	url: "UnicomService.asmx/GetTargetUserPhone",
                cache: false,
                data: JSON.stringify({"PCODE":sear}),
                beforeSend: function () { },
                success: function (result) {
					if(result.d.length>0){
						var html="";
						for(var i=0;i<result.d.length;i++){
						html+="<tr><td style='vertical-align:middle'>"+result.d[i].phoneinfo_PNO+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].userinfo_UNAME+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].userinfo_UIDNO+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].setmenus_SNAME+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].setflows_FNAME+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].phoneinfo_PSTATUS+"</td>";
                        html+="<td style='vertical-align:middle'>"+result.d[i].phoneinfo_PINITIME+"</td>";
                        html+="<td style='vertical-align:middle'><a class='btn btn-danger' data-toggle='modal' onclick='showDelUser("+result.d[i].phoneinfo_ID+")' href='#myModal'>销户</a></td></tr>";
					}	
					$("#table-userphone tbody").html(html);
					}else{
						alert("查无此号！");
					}
           		},
           		error: function (msg) { console.log(msg.responseText); }
         	});
    		}else{
    			initUserPhone();
    		}
    	}
    	
    	function initDelInfo(pid){
    		$.ajax({
	          	type: "post",
                dataType: "json",
                contentType: "application/json",                
	          	url: "UnicomService.asmx/GetTargetUserPhoneByID",
                cache: false,
                data: JSON.stringify({"PID":pid}),
                beforeSend: function () { },
                success: function (result) {
					$("#pcodecon").text(result.d[0].phoneinfo_PNO);
					$("#pinitimecon").text(result.d[0].phoneinfo_PINITIME);
					$("#psetcon").text(result.d[0].setmenus_SNAME);
					$("#pflowcon").text(result.d[0].setflows_FNAME);
					$("#pbalancecon").text(result.d[0].phoneinfo_PBALANCE);
					$("#pstatuscon").text(result.d[0].phoneinfo_PSTATUS);
					$("#unamecon").text(result.d[0].userinfo_UNAME);
					$("#ugendercon").text(result.d[0].userinfo_UGENDER);
					$("#uidnocon").text(result.d[0].userinfo_UIDNO);		
           		},
           		error: function (msg) { console.log(msg.responseText); }
         	});
    	}
    	
    	function showDelUser(pid){
    		initDelInfo(pid);
    		$("#btnDel").unbind("click").bind("click",function(){
    			$.ajax({
	          	type: "post",
                dataType: "json",
                contentType: "application/json",                
	          	url: "UnicomService.asmx/DelUser",
                cache: false,
                data: JSON.stringify({"PID":pid}),
                beforeSend: function () {
    				
                },
                success: function (result) {
					new jBox('Notice', {width: 240,height: 45,content: '销户成功！',autoClose: 2000,
						color: 'red',animation: {open: 'slide:right bottom',close: 'slide:top'},
						position: {x: ($(window).width()-240)/2,y: ($(window).height())/2}
					});
					setTimeout(function(){window.location.reload()},2000);
           		},
           		error: function (msg) { console.log(msg.responseText); }
         		});
    		});
    	}
    	
   		</script>
	<style>
		@media(max-width: 767px) {
			#btnSearch{
				margin-top: 15px;
				margin-left: 15px;
			}
		}
	</style>
</head>

<body>
     


<div class="wrap">
    <div class="page-header">
        <div class="leftside-header">
            <div class="logo">
                <a href="index.html" class="on-click">
                    <img alt="logo" src="images/header-logo.png" height="50"/>
                </a>
            </div>
            <div id="menu-toggle" class="visible-xs toggle-left-sidebar" data-toggle-class="left-sidebar-open" data-target="html">
                <i class="fa fa-bars" aria-label="Toggle sidebar"></i>
            </div>
        </div>
        <div class="rightside-header">
            <div class="header-middle"></div>
            <div class="header-section" id="search-headerbox">
                <input type="text" name="search" id="search" placeholder="Search...">
                <i class="fa fa-search search" id="search-icon" aria-hidden="true"></i>
                <div class="header-separator"></div>
            </div>
            <div class="header-section hidden-xs" id="notice-headerbox">
                <div class="notice" id="messages-notice">
                    <i class="fa fa-comments-o" aria-hidden="true"></i>
                    <span><i class="fa fa-exclamation-circle" aria-hidden="true"></i></span>
                    <div class="dropdown-box basic">
                        <div class="drop-header ">
                            <h3><i class="fa fa-comments-o" aria-hidden="true"></i> 信息</h3>
                            <span class="number">1</span>
                        </div>
                        <div class="drop-content">
                            <div class="widget-list list-left-element">
                                <ul>
                                    <li>
                                        <a href="#">
                                            <div class="left-element"><img alt="John Doe" src="images/avatar_1.jpg" /></div>
                                            <div class="text">
                                                <span class="title">John Doe</span>
                                                <span class="subtitle">Lorem ipsum dolor sit.</span>
                                            </div>
                                        </a>
                                    </li>                                   
                                </ul>
                            </div>
                        </div>
                        <div class="drop-footer">
                            <a>查看所有信息</a>
                        </div>
                    </div>
                </div>
                <div class="header-separator"></div>
            </div>
            <div class="header-section" id="user-headerbox">
                <div class="user-header-wrap">
                    <div class="user-photo">
                        <img src="images/user-avatar.jpg" alt="" />
                    </div>
                    <div class="user-info">
                        <span class="user-name"></span>
                        <span class="user-profile"></span>
                    </div>
                    <i class="fa fa-plus icon-open" aria-hidden="true"></i>
                    <i class="fa fa-minus icon-close" aria-hidden="true"></i>
                </div>
                <div class="user-options dropdown-box">
                    <div class="drop-content basic">
                        <ul>
                            <li> <a href="pages_lock-screen.html"><i class="fa fa-lock" aria-hidden="true"></i> 锁定系统</a></li>
                            <li> <a href="pages_user-profile.html"><i class="fa fa-user" aria-hidden="true"></i> 个人信息</a></li>
                            <li><a href="#"><i class="fa fa-cog" aria-hidden="true"></i>系统设置</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="header-separator"></div>
            <div class="header-section">
                <i class="fa fa-sign-out log-out" aria-hidden="true"></i>
            </div>
        </div>
    </div>
   <div class="page-body">
        <div class="left-sidebar">
            <div class="left-sidebar-header">
                <div class="left-sidebar-title">功能导航</div>
                <div class="left-sidebar-toggle c-hamburger c-hamburger--htla hidden-xs" data-toggle-class="left-sidebar-collapsed" data-target="html">
                    <span></span>
                </div>
            </div>
            <div id="left-nav" class="nano">
                <div class="nano-content">
                    <nav>
                        <ul class="nav" id="main-nav">
                            <li class="active-item"><a href="index.html"><i class="fa fa-home" aria-hidden="true">                            	
                            </i><span>主页</span></a></li>
                            <li >
                                <a href="newUser.html"><i class="fa fa-cubes" aria-hidden="true"></i><span>用户开户</span></a>                                
                            </li>
                            <li >
                                <a href="delUser.html"><i class="fa fa-pie-chart" aria-hidden="true"></i><span>用户销户</span></a>                                
                            </li>
                            <li class="has-child-item close-item">
                                <a><i class="fa fa-columns" aria-hidden="true"></i><span>业务办理</span></a>
                                <ul class="nav child-nav level-1">
                                    <li><a href="setMenu.html">资费套餐</a></li>
                                    <li><a href="setFlow.html">流量套餐</a></li>
                                    <li><a href="cruise.html">国际业务</a></li>
                                    <li><a href="lockPhoneCode.html">停机复机</a></li>
                                    <li><a href="changeUPWD.html">服务密码</a></li>
                                </ul>
                            </li>
                            <li class="has-child-item close-item">
                                <a><i class="fa fa-table" aria-hidden="true"></i><span>充值缴费</span></a>
                                <ul class="nav child-nav level-1">
                                    <li><a href="userRecharge.html">缴费/充值卡</a></li>
                                    <li><a href="scoreCharge.html">积分兑换</a></li>
                                </ul>
                            </li>
                            <li class="has-child-item close-item">
                                <a><i class="fa fa-files-o" aria-hidden="true"></i><span>系统管理</span></a>
                                <ul class="nav child-nav level-1">
                                    <li><a href="pages_lock-screen.html">锁定系统</a></li>
                                    <li><a href="pages_user-profile.html">个人信息</a></li>
                                    <li><a href="#">系统设置</a></li>
                                </ul>
                            </li>
                                </ul>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
        <div class="content">
            <div class="content-header">
                <div class="leftside-content-header">
                    <ul class="breadcrumbs">
                        <li><i class="fa fa-table" aria-hidden="true"></i><a href="index.html">主页</a></li>
                        <li><a>用户销户</a></li>
                    </ul>
                </div>
            </div>
            <div class="row animated fadeInRight">
                <div class="col-sm-12">
                    <div class="panel">
                        <div class="panel-content">
                            <div class="form-horizontal form-stripe">
                                <div class="form-group">
                                    <div class="col-sm-10">
                                        <input type="text" class="form-control" id="usearch" placeholder="请输入用户手机号进行查询">
                                    </div>
                                    <button onclick=searchUser($('#usearch').val()) class="col-sm-2 btn btn-warning" id="btnSearch" style="width:150px;color:white;margin-bottom:0px;border-radius: 6px;">查询</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-12">
                    <h4 class="section-subtitle">当前系统用户数据</h4>
                    <p class="section-text">点击表格中的销户按钮完成操作</p>
                    <div class="panel">
                        <div class="panel-content">
                            <div class="table-responsive">
                                <table class="table table-striped table-hover" id="table-userphone">
                                    <thead>
                                    <tr>
                                        <th>手机号</th>
                                        <th>开户人</th>
                                        <th>身份证号</th>
                                        <th>基础套餐</th>
                                        <th>流量套餐</th>
                                        <th>状态</th>
                                        <th>开户时间</th>
                                        <th>操错</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <a href="#" class="scroll-to-top"><i class="fa fa-angle-double-up"></i></a>
    </div>
      <!-- Modal -->
        <div aria-hidden="true" aria-labelledby="myModalLabel" role="dialog" tabindex="-1" id="myModal" class="modal fade">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header" style="background: #ff6100;">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" style="color: #fff;">销户信息确认</h4>
                    </div>
                    <div class="modal-body">
                        <div class="col-md-12">
                       		<div class="form-horizontal form-stripe">
                       			<div class="form-group" style="border-bottom: none;margin-bottom: 0;">
	                                <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">开户号码：</label>
	                                    <div class="col-sm-3">
	                                         <label id="pcodecon" class="form-control" style="border: none;box-shadow: none;"></label>
	                                </div>	
	                                 <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">开户时间：</label>
	                                    <div class="col-sm-3" class="form-control-feedback">
	                                         <label id="pinitimecon" class="form-control" style="border: none;box-shadow: none;padding: 6px 0"></label>
	                                    </div>
	                            </div>
	                            <div class="form-group" style="margin-bottom: 0;">
	                                <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">基础套餐：</label>
	                                    <div class="col-sm-3">
	                                         <label id="psetcon" class="form-control" style="border: none;box-shadow: none;"></label>
	                                    </div>
	                                <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">流量套餐：</label>
	                                    <div class="col-sm-3" class="form-control-feedback">
	                                         <label id="pflowcon" class="form-control" style="border: none;box-shadow: none;padding: 6px 0"></label>
	                                    </div>
	                            </div>
	                            <div class="form-group" style="margin-bottom: 0;">
	                                <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">资费余额：</label>
	                                    <div class="col-sm-3">
	                                         <label id="pbalancecon" class="form-control" style="border: none;box-shadow: none;"></label>
	                                    </div>
	                                <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">码号状态：</label>
	                                    <div class="col-sm-3" class="form-control-feedback">
	                                         <label id="pstatuscon" class="form-control" style="border: none;box-shadow: none;padding: 6px 0"></label>
	                                    </div>
	                            </div>
	                            <div class="form-group" style="border-bottom: none;margin-bottom: 0;">
	                                <label for="placeholder" class="col-sm-3 control-label" style="color: #999;">用户姓名：</label>
	                                    <div class="col-sm-3">
	                                         <label id="unamecon" class="form-control" style="border: none;box-shadow: none;"></label>
	                                    </div>
	                                <label for="placeholder" class="col-sm-3 control-label"  style="color: #999;">用户性别：</label>
	                                    <div class="col-sm-3" class="form-control-feedback">
	                                         <label id="ugendercon" class="form-control" style="border: none;box-shadow: none;"></label>
	                                    </div>
	                            </div>
	                            <div class="form-group" style="border-bottom: none;;margin-bottom: 0;">
	                                <label for="placeholder" class="col-sm-3 control-label" style="color: #999;">身份证号：</label>
	                                    <div class="col-sm-9">
	                                         <label id="uidnocon" class="form-control" style="border: none;box-shadow: none;"></label>
	                                </div>	                                
	                            </div>	                            
	                            
	                            <div class="form-group" style="height: 50px;line-height: 30px;margin-bottom: 0;">	                                
	                                <div class="col-sm-12">
	                                   	<label id="amount" class="form-control" style="border: none;box-shadow: none;color: orangered;">
	                                   		关于销户：销户后的手机号将会与当前使用人没有任何关系，号码中的业务将被清空，号码也会保持冻结状态，后续酌情从新启用。
	                                   	</label>
	                                </div>	                                
	                            </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer"  style="border: none;">
                        <button data-dismiss="modal" class="btn btn-default" type="button">取消</button>
                        <button  class="btn btn-danger" type="button" id="btnDel">确认销户提交</button>
                    </div>
                </div>
            </div>
        </div>
        <!-- modal -->
</div>
</body>
	<script src="javascripts/template-script.min.js"></script>
	<script src="javascripts/template-init.min.js"></script>
</html>
